<template>
	<view>
		<uni-nav-bar :title="$t('personal.text16')" :fixed="true" :border="false" color="var(--theme-text-color)" backgroundColor="var(--theme-color)"></uni-nav-bar>
		<view class="icon-xl circle flex-center back-btn" style="position: fixed;top: 5px;left: 16px;z-index: 100;" @click="backPage">
			<uni-icons type="arrow-left" size="24" color="#fff"></uni-icons>
		</view>
		<view class="mt10 p-lr-16">
			<view class="flex-column">
				<view class="my-item radius-12 fs14 flex-between mt10" style="box-sizing: border-box;background-color: var(--theme-box-bg);;">
					<text class="pid-text-ususal fs14">{{$t('personal.langSet')}}</text>
					<view class="" @click="openPopup">
						<text class="text-des-color">{{getLang($i18n.locale)}}</text>
						<uni-icons type="right" color="#999" size="15"></uni-icons>
					</view>
				</view>
				<view class="my-item radius-12 fs14 flex-between mt10" style="box-sizing: border-box;background-color: var(--theme-box-bg);;">
					<text class="pid-text-ususal fs14">{{$t('loginPwd')}}</text>
					<navigator url="/pages/personal/setting/change-pwd?type=1">
						<text class="text-des-color">{{$t('edit')}}</text>
						<uni-icons type="right" color="#999" size="15"></uni-icons>
					</navigator>
				</view>
				<view class="my-item radius-12 fs14 flex-between mt10" style="box-sizing: border-box;background-color:var(--theme-box-bg);;">
					<text class="pid-text-ususal fs14">{{$t('payPwd')}}</text>
					<navigator url="/pages/personal/setting/change-pwd?type=2">
						<text class="text-des-color">{{$t('edit')}}</text>
						<uni-icons type="right" color="#999" size="15"></uni-icons>
					</navigator>
				</view>
				<view class="my-item radius-12 fs14 flex-between mt10" @click="clearStorage" style="box-sizing: border-box;background-color: var(--theme-box-bg);;">
					<text class="pid-text-ususal fs14">{{$t('clearStorage')}}</text>
				</view>
			</view>
		</view>
		<selectLang :select="select"></selectLang>
	</view>
</template>

<script setup>
	import { ref } from 'vue';
	import { getLang } from '/utils/utils.js'
	import useGlobalProperties from '/utils/useGlobalProperties.js'
	import selectLang from '/components/selectLang.vue';
	const { $t,$i18n } = useGlobalProperties()
	const select = ref(0)
	const backPage = () =>{
		// 返回上一页
		// uni.navigateBack({
		//   delta: 1 // 默认值为1，表示返回上一页
		// });
		history.back()
	}
	const openPopup = () => {
	  select.value++
	}
	const clearStorage = () =>{
		uni.showToast({
			title: $t('clearStorage'),
			icon:'none'
		});
	}
</script>

<style scoped>
.my-item{
	width: 100%;
	padding: 15px 12px;
	box-sizing: border-box;
}
</style>
